import { upRelease } from '@/services/ant-design-pro/source';
import { PlusOutlined } from '@ant-design/icons';
import { ActionType, ModalForm, ProFormSelect, ProFormText, ProFormTextArea } from '@ant-design/pro-components';
import { FormattedMessage, useIntl, useRequest } from '@umijs/max';
import { Button, message } from 'antd';
import { FC } from 'react';

export type UpdateFormProps = {
  trigger?: JSX.Element;
  onOk?: () => void;
  values: any;
};

const UpdateForm: FC<UpdateFormProps> = (props) => {
  const { onOk, values, trigger } = props;

  const [messageApi, contextHolder] = message.useMessage();
  /**
   * @en-US International configuration
   * @zh-CN 国际化配置
   * */
  const intl = useIntl();

  const { run, loading } = useRequest(upRelease, {
    manual: true,
    onSuccess: () => {
      messageApi.success('更新成功');
      onOk?.();
    },
    onError: () => {
      messageApi.error('更新失败');
    },
  });

  return (
    <>
      {contextHolder}
      <ModalForm
        title={intl.formatMessage({
          id: 'pages.searchTable.createForm.newRule',
          defaultMessage: 'New rule',
        })}
        trigger={trigger}
        width="400px"
        modalProps={{ okButtonProps: { loading }, destroyOnClose: true }}
        onFinish={async (value) => {
          await run({...value, id: values.id});
          return true;
        }}
      >
        <ProFormText
          rules={[
            {
              required: true,
              message: '合集名称',
            },
          ]}
          initialValue={values.name}
          label="合集名称"
          width="md"
          name="name"
        />
        <ProFormText
          rules={[
            {
              required: true,
              message: '序列号',
            },
          ]}
          initialValue={values.sort}
          label="序列号"
          width="md"
          name="sort"
        />
        <ProFormSelect
          rules={[
            {
              required: true,
              message: (
                <FormattedMessage
                  id="pages.searchTable.ruleName"
                  defaultMessage="Rule name is required"
                />
              ),
            },
          ]}
          label='状态'
          width="md"
          name="status"
          initialValue={{label: values.status === 1 ? '开启' : '关闭', value: values.status}}
          request={async () => {
            return [
              {label: '开启', value: 1},
              {label: '关闭', value: 0}
            ]
          }}
        />
      </ModalForm>
    </>
  );
};

export default UpdateForm;
